<template>
  <div class="operation-page">
    <layout>
      <keep-alive>
        <router-view class="page-item"></router-view>
      </keep-alive>
    </layout>
  </div>
</template>

<script>
import Layout from '@/layout';

export default {
  name: "OperationPage",
  props: {

  },
  data() {
    return {
    };
  },
  computed: {

  },
  mounted() {
    this.$store.commit('updateClientsCache');
    this.$store.commit('updateOrdersCache');
    this.$store.commit('updateDeliveriesCache');
    const version = window.localStorage.getItem('version');
    const systemVersion = this.$store.state.systemVersion;
    if (version !== systemVersion) {
      window.localStorage.setItem('version', systemVersion);
      this.$notification.open({
        message: '更新',
        description:
          `已更新${systemVersion}版本，请在"关于"页面查看更新日志`,
        duration: 0,
        placement: 'topLeft'
      });
    }
  },
  watch: {
    '$store.state.clientsCache' () {
      this.$message.loading('加载客户列表数据，请稍等', 1);
    },
    '$store.state.ordersCache' () {
      this.$message.loading('加载订单列表数据，请稍等', 1);
    },
    '$store.state.deliveriesCache' () {
      this.$message.loading('加载送货单列表数据，请稍等', 1);
    },
  },
  methods: {

  },
  components: {
    Layout
  },
};
</script>

<style scoped lang="scss">
.operation-page {
  height: 100%;
  .page-item {
    padding-bottom: 20px;
  }
}
</style>
